<!doctype html>
<html>
<head>
<meta charset="utf-8">
	<title>支付</title>
	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">     
	<meta content="yes" name="apple-mobile-web-app-capable">     
	<meta content="black" name="apple-mobile-web-app-status-bar-style">     
	<meta content="telephone=no" name="format-detection">
	<link rel="shortcut icon" href="/favicon.ico">
	<link rel="stylesheet" type="text/css" href="/H5/css/sm.min.css?v=10" />
	<link rel="stylesheet" type="text/css" href="/H5/css/reset.css?v=10" />
	<link rel="stylesheet" type="text/css" href="/H5/css/order.css?v=10" />
</head>
<body>
	<div class="page-group ms-controller" :controller="pay">
        <div class="page page-current">
            <header class="bar bar-nav">
              	<a class="icon icon-left pull-left" href="javascript:window.history.go(-1)"></a>
              	<a class="icon icon-home pull-right" href="/H5"></a>
              	<h1 class="title">支付</h1>
            </header>
            <div class="content visibility">
            	<a :attr="{'href': @data.is_invite==0?'/H5/orderlist?status=0':'/H5/friendlist?type=1&status=0'}" style="display: block; float: right; margin: 0 5%;padding: 2% 0; font-size: .8rem">订单中心</a>
	            <div class="balance" style="clear: both"><span>支付金额:</span><span style="color: red; float: right;">￥{{@data.pay_money||""}}</span></div>
	            <div class="card card_first card_first01">
					<ul class="address_ul">
						<li>账户余额 ￥{{@info.balance||""}}</li>
                    </ul>
	    			<div class="yess">
	                    <a href="javascript:;" style="width: 100%;" :on-click="@payMoney">立即支付</a>
	    			</div>
				</div>  
            </div>
        </div>
    </div>
	<script type='text/javascript' src='/H5/js/zepto.min.js' charset='utf-8'></script>
	<script type='text/javascript' src='/H5/js/sm.min.js' charset='utf-8'></script>
	<script type='text/javascript' src='/H5/js/avalon.js' charset='utf-8'></script>
	<script type='text/javascript' src='/H5/js/simpleStorage.js' charset='utf-8'></script>
	<script type='text/javascript' src='/H5/js/mall.js' charset='utf-8'></script>
	<script>
		var pay = avalon.define({
			$id: "pay",
			info: {},
			data: {},
			orderId: Mall.parseUrl( window.location.href ).orderId,
			getInfo: function(){
				Mall.request( "/api/UserInfo" )
					.always( function( data ){
						if( data.error_code == 0 ){
							pay.info = data.data;
							$( ".content" ).removeClass( "visibility" );
						}
						else{
							$.alert(data.error_msg)
						}
					} )
			},
			getOrderDetail: function(){
				Mall.request( "/api/OrderDetail", {order_no: pay.orderId} )
					.always( function( data ){
						if( data.error_code == 0 ){
							pay.data = data.data;
						}
						else{
							$.alert(data.error_msg)
						}
					} )
			},
			payMoney: function(){
				var postData = {
					order_no: pay.orderId,
				}
		    	$.prompt("请输入支付密码", function( value ){
		    		postData.pay_password = value;
		    		Mall.request( "/api/OrderPay", postData )
		    			.always( function( data ){
		    				if( data.error_code == 0 ){
		    					$.toast( "支付成功", 1000, "success", function(){
		    						if( pay.data.is_invite == 0 ){
		    							window.location.href = "/H5/orderlist?status=1"
		    						}
		    						else{
		    							if( pay.data.is_my_invite == 0 ){
		    								window.location.href = "/H5/friendlist?type=1&status=1"
		    							}
		    						}
		    					} )
		    				}
		    				else{
		    					$.alert(data.error_msg);
		    				}
		    			} )
		    	})
		    	$( "input.modal-text-input" ).attr( "type", "password" )
			}
		})
		pay.getOrderDetail();
		pay.getInfo();
		avalon.scan( document.body )
	</script>
</body>
</html>